<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta content="telephone=no,email=no" name="format-detection">
    <script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.4/??flexible_css.js,flexible.js"></script>
    <link rel="stylesheet" type="text/css" href="css/loan.css">
    <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
    <title>Authentication</title>
</head>

<body>
    
    <section class="input_authentication"> 
    	<div class="cell_input">
    		<div id="item-idCode" class="item-content">
			    <div class="item-inner">
			        <div class="item-text">
			            <span>身份证认证</span>
			        </div>
                    <div class="item-media"><i class="icon"></i></div>
			    </div>
			</div>

            <div id="item-idperInfor" class="item-content">
                <div class="item-inner">
                    <div class="item-text text-pink">
                        <span>个人信息认证</span>
                    </div>
                    <div class="item-media"><i class="icon icon-pink"></i></div>
                </div>
            </div>

            <div id="item-idOperator" class="item-content">
                <div class="item-inner">
                    <div class="item-text text-pink">
                        <span>运营商认证</span>
                    </div>
                    <div class="item-media"><i class="icon icon-pink"></i></div>
                </div>
            </div>

            <div class="item-content">
                <a href="">
                    <div class="item-inner">
                        <div class="item-text text-pink">
                            <span>芝麻信用认证</span>
                        </div>
                        <div class="item-media"><i class="icon icon-pink"></i></div>
                    </div>
                </a>
            </div>

            <div id="item-idqq" class="item-content">
                    <div class="item-inner">
                        <div class="item-text text-pink">
                            <span>QQ通讯录同步</span>
                        </div>
                        <div class="item-media"><i class="icon icon-pink"></i></div>
                    </div>
            </div>
      
    	</div>
    	<div class="cell_btn">
    		<a href="#" class="button-big button-success">马上拿钱</a>
    	</div>
    </section>
 
    
    <!-- 身份认证费用 -->
    <section id="id_Card" class="popupCon md-effect-1">
        <div class="md-content">
            <div class="cost_head">
                <div class="cost_text">
                    <span class="t_1">资料认证费</span>
                    <span class="t_2">只收取一次费用，后续认证不再收费</span>
                    <span class="t_3">￥9.99</span>
                </div>
            </div>
            <div class="cost_inner">
                <span class="t_4">支付方式</span>
                <div class="t_pay">
                    <img src="images/zhifubao.png">
                    <span class="t_5">支付宝</span>
                </div>
            </div>
            <div class="cell_btn">
                <a href="#" class="button-big button-success">立即支付</a>
            </div>
        </div>
    </section>
    <!-- 个人信息认证费用 -->
    <section  id="id_perInfor" class="popupCon md-effect-1">
      <div class="md-content">
          <div class="perInfo">
              <span class="infoTit">提示</span>
              <p>允许“快借“在您使用时访问您的位置吗？</p>
          </div>
          <div class="cell_btn_two">
            <a href="#" class="button-small button-normal">不允许</a>
            <a href="#" class="button-small button-success">允许</a>
          </div>
      </div>
    </section>
    <!-- 运营商认证费用 -->
    <section id="id_Operator" class="popupCon md-effect-1">
      <div class="md-content">
          <div class="perInfo">
              <span class="infoTit">为开启通讯录权限，无法获取手机号</span>
              <p>请在【设置-隐私-通讯录】中开启通讯录权限</p>
          </div>
          <div class="cell_btn_two">
            <a href="#" class="button-small button-normal">取消</a>
            <a href="#" class="button-small button-success">立即开启</a>
          </div>
      </div>
    </section>
    <!-- QQ通讯录同步 -->
    <section id="id_qq" class="popupCon md-effect-1">
      <div class="md-content">
          <div class="perInfo">
              <span class="infoTit">“大师借条”想要打开“QQ”</span>
              <div class="qqCon">
                  <p>将获得以下权限：</p>
                  <p>1、您的昵称、头像、性别</p>
                  <p>2、您的通讯录信息</p>
              </div>
          </div>
          <div class="cell_btn_two">
            <a href="#" class="button-small button-normal">取消</a>
            <a href="#" class="button-small button-success">打开</a>
          </div>
      </div>
    </section>
    <div class="y_hide"></div>

    <script type="text/javascript">
       $("#item-idCode").click(function(){
          $("#id_Card").addClass("md-show");
       });
       $("#item-idperInfor").click(function(){
          $("#id_perInfor").addClass("md-show");
       });
       $("#item-idOperator").click(function(){
          $("#id_Operator").addClass("md-show");
       });
       $("#item-idqq").click(function(){
          $("#id_qq,.y_hide").addClass("md-show");
       });

       $(".y_hide").click(function(){
         $("#id_Card,#id_perInfor,#id_Operator,#id_qq,.y_hide").removeClass("md-show");
       })
    </script>
</body>
</html>